note
<template>
  <div class="app-container">
    <OrderSearch
      :options1="options1"
      :value="value"
    />
    <el-button type="primary" style="background:#438dee;margin:20px 0 10px 0;">添加商品</el-button>
    <el-table
      :data="tableData"
      style="width: 1200px"
    >
      <el-table-column
        align="center"
        prop="goods"
        label="商品"
        width="350"
      >
        <template #default="{row}">
          <div class="table-goods">
            <img class="table-goods-img" style="width:100px;height:100px" :src="row.img" alt="">
            <span class="table-goods-desc">{{ row.goods }}</span>
          </div>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop="classify"
        label="商品分类"
        width="180"
      />
      <el-table-column
        align="center"
        prop="money"
        label="商品价格"
      />
      <el-table-column
        align="center"
        prop="num"
        label="销售量"
      />
      <el-table-column
        align="center"
        prop="status"
        label="上架状态"
      />
      <el-table-column
        align="center"
        prop="check"
        label="审核状态"
      />
      <el-table-column
        align="center"
        prop="address"
        label="操作"
        width="200"
      >
        <template #default>
          <el-button type="primary" style="background:#199ed8;color:#fff">编辑</el-button>
          <el-button type="primary" style="background:#fff;color:#438df1">下架</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      options1: [{
        value: '',
        label: '全部'
      }, {
        value: '选项1',
        label: '黄金糕'
      }],
      value: '',
      tableData: [{
        goods: '小米蓝夜耳机(故宫特质版本)',
        img: require('@/assets/1.png'),
        classify: '耳机',
        money: '￥396.00',
        num: 100,
        status: '上架',
        check: '审核通过'
      }, {
        goods: '小米蓝夜耳机(故宫特质版本)',
        img: require('@/assets/1.png'),
        classify: '耳机',
        money: '￥396.00',
        num: 200,
        status: '上架',
        check: '审核通过'
      }]
    }
  },
  methods: {

  }
}
</script>

<style scoped lang="scss">
  .app-container{
    margin-top: 30px;
  }
  .table-goods{
    display: flex;
    align-items: center;
    &-img{
      margin-left: 10px;
    }
    &-desc {
      margin-left: 10px;
    }
  }
</style>

